<div class="container">
  <div class="swiper-box module-bottom">
    <div id="carousel" class="carousel-module">
      <div class="swiper-wrapper">
        <?php foreach ($banners as $banner) { ?>
        <div class="swiper-slide">
          <div class="item text-center">
            <?php if ($banner['link']) { ?>
            <a href="<?php echo $banner['link']; ?>"><img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" /></a>
            <?php } else { ?>
            <img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" />
            <?php } ?>
          </div>
        </div>
        <?php } ?>
      </div>
    </div>
    <div class="swiper-button-next"><i class="fa fa-angle-right" aria-hidden="true"></i></div>
    <div class="swiper-button-prev"><i class="fa fa-angle-left" aria-hidden="true"></i></div>
  </div>
</div>

<script>
$(document).ready(function() {
  var module_carouse_swiper = new Swiper('#carousel', {
    loop: true,
    pagination: '.swiper-pagination',
    slidesPerView: 6,
    paginationClickable: true,
    nextButton: '.swiper-button-next',
    prevButton: '.swiper-button-prev',
    spaceBetween: 30
  });
});
</script>
